<template>
    <div>
        <el-form
            style="margin-top:20px;"
            ref="ruleForm"
            :label-position="labelPosition"
            label-width="120px"
            class="demo-ruleForm container"
        >
            <h3>产成品入库单</h3>
            <el-row style="margin-top:20px;">
                <el-col :span="12">
                    <el-form-item label="部门编码：" >{{formData.cDepCode}}</el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="制单人：" >{{formData.cMaker}}</el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="发送状态：" >{{formData.sendState==1?'失败':'成功'}}</el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="备注：" >{{formData.cMemo}}</el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="收发类别编码：" >{{formData.cRdCode}}</el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="仓库编码：" >{{formData.cWhCode}}</el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="产成品入库单：" >{{formData.cCode}}</el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <div class="container" style="margin-top: 20px;">
            <h3>入库推送记录</h3>
            <el-table
                :data="tableData"
                border
                style="margin-top:20px;"
            >
                <el-table-column prop="cInvCode" sortable  label="存货编码"></el-table-column>
                <el-table-column prop="breedName" sortable  label="品名"></el-table-column>
                <el-table-column prop="iQuantity" sortable  label="入库数量"></el-table-column>
                <el-table-column prop="cBatch" sortable  label="批号" ></el-table-column>
                <el-table-column prop="cBatchproperty9" sortable  label="产地" ></el-table-column>
                <el-table-column prop="cBatchProperty8" sortable  label="上市备案号" ></el-table-column>
                <el-table-column prop="dMadeDate" sortable  label="生产日期" ></el-table-column>
            </el-table>
            <el-pagination layout="total, prev, pager, next, jumper" :page-size="pagination.pageSize" :current-page.sync="pagination.page" :total="pagination.total"  @current-change="pageChange" style="margin-top:20px"></el-pagination>
        </div>
    </div>
</template>

<script>
import { selectStoragedProductById } from '@/request/api';

export default{
    data(){
        return{
            formData:{},
            tableData:[],
            labelPosition:'right',
            pagination:{
                pageSize:15,
                page:1,
                total:0,
            },
            id:'',
        }
    },
    created(){

    },
    mounted() {
        this.id = this.$route.query.id
        this.getData()
    },
    methods:{
        async getData(){
            const data = await selectStoragedProductById('?id='+this.id)
            this.formData = data.data
            this.tableData = data.data.details
            this.pagination.total = this.tableData.length
        },
        pageChange(page){
            this.pagination.page = page

        },
        handleExport(){
            window.location.href = "http://" + window.location.host + "/supply/export/" + this.inputs.id;
        }
    }
}
</script>

<style>
.el-pagination{
    text-align: center;
}
/deep/.el-dialog{
    display: flex;
    flex-direction: column;
    margin:0 !important;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    max-height:calc(100% - 30px);
    max-width:calc(100% - 30px);
}
.customWidth{
    width:30%;
}

</style>
